<!DOCTYPE html>
<html lang="en"  >
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>My monitor</title>
    <link rel="stylesheet" href="../static/layui/css/layui.css">
    <link rel="stylesheet" href="../static/css/view.css">
    <link rel="stylesheet" type="text/css" href="../static/css/style.css">
<!--     <link rel="stylesheet" type="text/JavaScript" href="../static/js/jquery-3.5.1.js">-->
<script type="text/JavaScript" src="{{ url_for('static',filename='/js/jquery-3.5.1.js') }}"></script>
    <script type="text/javascript" src="../static/layui/layui.js"></script>

</head>
<body class="layui-layout-body"  >

<div class="layui-layout layui-layout-admin">
    <div class="layui-header sideback">
        <div class="layui-logo"><i class="layui-icon" >&#xe65d;</i>  宿舍监控管理系统</div>

        <ul class="layui-nav layui-layout-left">
            <li class="layui-nav-item" >
                <a href="javascript:;" name="side"><i class="layui-icon">&#xe668;</i></a>
            </li>
        </ul>

        <ul class="layui-nav layui-layout-right">
            <li class="layui-nav-item"><a href="/main"><i class="layui-icon" style="font-size: 20px;">&#xe68e;</i>&nbsp home</a></li>

            <li class="layui-nav-item"><a href="/exit"><i class="layui-icon" style="font-size: 15px; color: #1E9FFF;">&#xe682;</i>退出</a></li>
        </ul>
    </div>

    <div class="layui-side layui-bg-black sideback">
        <div class="layui-side-scroll">
            <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
            <ul class="layui-nav layui-nav-tree sidestyle"  lay-filter="test">
                <li class="layui-nav-item layui-nav-itemed"><a href="javascript:;"><i class="layui-icon" >&#xe68e;</i>  <span>查看宿舍</span></a>
                <dl class="layui-nav-child">
                <dd ><a href="roomstatus"><i class="layui-icon" >&#xe68c;</i>  <span>宿舍状态</span></a></dd>
                <dd ><a href="#"><i class="layui-icon" >&#xe613;</i>  <span>宿舍成员</span></a></dd>
                 <dd ><a href="records"><i class="layui-icon" >&#xe6ed;</i>  <span>监控记录</span></a></dd>
                </dl>
                </li>

                <li class="layui-nav-item layui-nav-itemed"><a href="javascript:;"><i class="layui-icon" >&#xe615;</i>  <span>个人空间</span></a>
                <dl class="layui-nav-child">
                <dd ><a href="vieweditaccount"><i class="layui-icon" >&#xe66f;</i>  <span>我的信息</span></a></dd>

                <dd ><a href="/viewtimetable"><i class="layui-icon" >&#xe62d;</i>  <span>我的课表</span></a></dd>
                </dl>
                </li>

            </ul>
        </div>
    </div>
<div class="layui-body">
        <!-- 内容主体区域 -->
    <form action="/search">
        <div class="layui-form">
            <div class="layui-input-inline" style="width: 75%; margin-left: 10px;">
                <input type="text" name="keyword" placeholder="请输入搜索内容，格式xxxx-xx-xx" autocomplete="off" class="layui-input ">
            </div>

            <div class="layui-btn-group" style="float: right;" >
                <input class="layui-btn" type="submit" name="search" value="搜索"/>
                <button class="layui-btn" type="button" name="reset_search">重置</button>
            </div>
        </div>
     </form>
        <table id="records" class="layui-table"  lay-skin="nob" lay-filter="records_table" style="background-color: transparent;font-weight: bold;color: black" >
            <thead>
            <tr>
                <th lay-data="{field:'roomid', sort: true}"><i class="layui-icon" >&#xe770;</i> 宿舍号</th>
                <th lay-data="{field:'time'}"><i class="layui-icon" >&#xe68d;</i> 记录时间</th>
                <th lay-data="{field:'type'}"><i class="layui-icon" >&#xe69c;</i> 异常类型</th>
<!--                <th lay-data="{field:'video'}"><i class="layui-icon" >&#xe64c;</i> 视频路径</th>-->
                 <th lay-data="{field:'viewVideo'}"><i class="layui-icon" >&#xe64c;</i> 操作</th>
                <th> </th>
            </tr>
            </thead>
            <tbody>
            {% for record in records %}
            <tr>
                <td>{{record.roomId}}</td>
                <td>{{record.time}}</td>
                <td>{{record.reason}}</td>
                 <td>
                     <a href="{{ url_for('viewrecord', recordSrc=record.video  ) }}" >查看视频</a>
                     <span></span>
                     <a href="{{ url_for('deleterecord', recordSrc=record.video  ) }}" >删除记录</a>
                 </td>
            </tr>
            {% endfor %}
            </tbody>
        </table>

    </div>

    <div class="layui-footer">
        <div class="section">
            <p><sub>Copyright <a href="http://www.csu.edu.cn">Central South University</a> </sub></p>
        </div>
    </div>
</div>







<script src="../static/layui/layui.js"></script>
<script>
//注意：导航 依赖 element 模块，否则无法进行功能性操作
layui.use('element', function(){
  var element = layui.element;

  //…
});
</script>


</body>
</html>